<template>
	<section id="home_search">
		<!-- <van-nav-bar title="超级搜索" left-arrow @click-left="onClickLeft"/> -->
		<!-- 搜索框 -->
		<van-search id="searchIpt" v-model="supValue" placeholder="请输入宝贝名称,关键字,关键词" show-action @search="onSupSearch">
			<div class="searchBtn" slot="action" @click="onSupSearch">搜索</div>
		</van-search>

		<!-- 搜索列表 -->
		<van-card v-for='item in listMain' 
		:price="item.zk_final_price" 
		:origin-price="item.reserve_price" 
		:title="item.title" 
		:desc="item.nick"  
		:thumb="item.pict_url" 
		>
		 <div slot="footer">
			<!-- <van-button plain type="default" size="mini" @click="detailFunc(item.num_iid)">详情</van-button> -->
			<van-button plain type="primary" size="mini" @click="convertFunc(item.num_iid)">领优惠</van-button>
		</div>
		</van-card>
		
		<div v-if="totalNum">
			<van-pagination 
			v-model="currentPage" 
			:total-items="totalNum" 
			:items-per-page = "10"
			:show-page-size="3" 
			force-ellipses
			@change = "onSupSearch(false)"
			/>
		</div>
		

	</section>
</template>

<script>
	export default {
		data() {
			return {
				supValue: '',
				listMain: [],
				currentPage: 1,
				totalNum: 0,
			};
		},
		components: {

		},
		methods: {
			onClickLeft(){
				this.$router.go(-1)
			},
			jumpRouter(uri,querys) {
				this.$router.push({path: uri,query:querys})
			},
			onSupSearch(notChu) {
				let supValue = this.supValue;
				if (!supValue) {
					this.$toast('请输入正确内容');
					return false;
				}
				this.service.superSearch({
					q: supValue,
					page_no: this.currentPage,
					page_size: '10'
				}).then(res => {
					if (res.code == 1) {
						if(notChu){
							this.currentPage = 1
						}
						let list = res.data;
						this.listMain = list.tbk_item_get_response.results.n_tbk_item;
						this.totalNum = list.tbk_item_get_response.total_results
					}
				})
			},
			convertFunc(num_iid){
				num_iid = num_iid + '';
				this.jumpRouter('/coupon',{num_iids:num_iid})
			},
			detailFunc(num_iid){
				this.jumpRouter('/detail',{num_iids:num_iid})
			},
			myFocus:function(){
				var idObj = document.getElementById('searchIpt');
				 idObj.focus();
		  }
		},
		mounted() {

			this.supValue = this.$store.state.publicMoudle.superVal
			this.myFocus()
			
		},
		computed: {

		},
		watch: {
			'supValue' (newVal,old){
				this.$store.dispatch('setPublicData', {name: 'setsuperVal',val: newVal})
			}
		},

	};
</script>
<style scoped lang="scss">
#home_search{
	padding-bottom: 120px;
	
	.van-search{
		background: #FF852A !important;	
	}

	.searchBtn{
		padding: 0 10px;
		font-size: 28px;
		line-height: 30px;
		color: white;
	}
}
</style>
